<!DOCTYPE html>
<html class="x-admin-sm">
  <head>
    <meta charset="UTF-8">
    <title>{$list.webtitle}</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    {load href="__STATIC__/xadmin/css/font.css" /}
    {load href="__STATIC__/xadmin/css/xadmin.css" /}
    {load href="__STATIC__/xadmin/js/jquery.min.js" /}
    {load href="__STATIC__/xadmin/lib/layui/layui.js" /}
    {load href="__STATIC__/xadmin/js/xadmin.js" /}
    {load href="__STATIC__/xadmin/js/cookie.js" /}
    {load href="__STATIC__/xadmin/js/md5.min.js" /}
    {block name="jsset"}{/block}
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body class="">
    <div class="x-nav">
      {block name="nav"}{/block}
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="iconfont" style="line-height:30px">&#xe6aa;</i></a>
    </div>
    <div class="x-body">
      <div class="layui-collapse">
        <div class="layui-colla-item">
          <h2 class="layui-colla-title">筛选</h2>
          <div class="layui-colla-content layui-hidden" style="margin: 2;padding: 2;">
            <div class="layui-row">
              <form class="layui-form layui-form-pane" id="search" lay-filter="search">
                {block name="search"}{/block}
                <div class="layui-form-item" style="text-align: right;">
                    <input type="hidden" class="layui-btn" id="srcsubmit" lay-filter="srcsubmit" lay-submit="">
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
      {block name="table"}{/block}
    </div>
    <!-- 状态按钮 -->
    <script type="text/html" id="status">
      <span class="layui-btn {{ d.status == 1 ? 'layui-btn-normal' : 'layui-btn-disabled' }} layui-btn-mini" lay-event="status">{{ d.status == 1 ? '启用' : '禁用' }}</span>
    </script>
    <script type="text/javascript">
        //config的设置是全局的
        layui.config({
            base: "__STATIC__/xadmin/js/" //假设这是你存放拓展模块的根目录
        });

        // 声明表格,和表格参数变量
        var userTable,options,formval;
        // 设置表格初始变量
        options = {
          elem: '#tabledemo',
          toolbar: '#toolbarDemo',
          url:"{:url('ajaxdata')}",
          method:"POST",   //数据接口
          page: true, //开启分页
          loading:true,
          autoSort:false,
          id:'mytable',
          defaultToolbar:'',
          where:{},
          limits:[10,25,50,75,100],
          limit:10,
          // height:390,
        };
    </script>
    {block name="myjs"}{/block}
    <script type="text/javascript">
        // 实例化表格
        layui.use('table',function(){
          var lTable = layui.table;
          userTable = lTable.render(options);  //获取数据并渲染

          // 监听排序
          lTable.on('sort(mytable)', function(obj){
            $("#srcsubmit").click();
            formval.field = obj.field;
            formval.type = obj.type; 
            tablereload(formval);
          });
        });

        // 提交搜索条件后重载表格
        layui.use('form',function(){
          var form = layui.form;
          // 监听表单提交
          form.on('submit(srcsubmit)', function(data){
            formval = data.field;
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
          });
        });

        // 表格重载
        function tablereload(val)
        {
          userTable.reload({
              where: val
              ,page: {
                curr: 1 //重新从第 1 页开始
              }
            });
        }

        // 提交表单
        function clickSearchButton(){
            $("#srcsubmit").click();
            tablereload(formval);
        }

        // 获取搜索框文字
        $('#searchval').bind("keyup",function(){
            var searchval = $('#searchval').val();
            if($.trim(searchval)!="" || searchval==""){
                $("#srcsubmit").click();
                tablereload(formval);
            }
        })
    </script>
  </body>
</html>